<!DOCTYPE html>

<!--[if IE 8]>
<html class="ie8"><![endif]-->
<!--[if IE 9]>
<html class="ie9"><![endif]-->
<!--[if gt IE 9]><!-->
<html><!--<![endif]-->
<head>
    <title>猫眼电影 - 一网打尽好电影</title>


    <meta charset="utf-8">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta http-equiv="cleartype" content="yes"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="renderer" content="webkit"/>

    <meta name="HandheldFriendly" content="true"/>
    <meta name="format-detection" content="email=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet"
          href="//s3plus.meituan.net/v1/mss_e2821d7f0cfe4ac1bf9202ecf9590e67/cdn-prod/file:5788b470/common.6b1d782c.css"/>
    <link rel="stylesheet"
          href="//s3plus.meituan.net/v1/mss_e2821d7f0cfe4ac1bf9202ecf9590e67/cdn-prod/file:5788b470/profile-profile.772600de.css"/>
    <!-- <script>"use strict";!function(){var i=0<arguments.length&&void 0!==arguments[0]?arguments[0]:"_Owl_",n=window;n[i]||(n[i]={isRunning:!1,isReady:!1,preTasks:[],dataSet:[],use:function(i,t){this.isReady&&n.Owl&&n.Owl[i](t),this.preTasks.push({api:i,data:[t]})},add:function(i){this.dataSet.push(i)},run:function(){var t=this;if(!this.isRunning){this.isRunning=!0;var i=n.onerror;n.onerror=function(){this.isReady||this.add({type:"jsError",data:arguments}),i&&i.apply(n,arguments)}.bind(this),(n.addEventListener||n.attachEvent)("error",function(i){t.isReady||t.add({type:"resError",data:[i]})},!0)}}},n[i].run())}();</script> -->

    <!-- <script>
    cid = "c_dxfehttw";
    ci = 531;
        window.system = {"user":{"id":981246875,"token":"sGetA8-rwVDTRJ1Gu2YxWWhO_GAAAAAACw4AAHBuKktVgW2bUDqU9EFT0TtL_TmpPPl-K7gD46WLnerzLTi2AQyjXcWHPpmLU5sDjg","username":"tXk303947856","profile":{"age":"25","authInfo":"","avatarType":255,"avatarurl":"https://img.meituan.net/avatar/6a2bdaca63d92ccb9d038aebb3ec4b1a39399.jpg","birthday":-2240553957000,"certificateIcon":"","certificateName":"","certificateRedirectUrl":"","city":null,"currentExp":20,"gender":0,"id":981246875,"interest":"美食,公益,动漫,音乐","juryLevel":0,"maoyanAge":"3.5","marriage":"为人父母","mobile":"1e486a9636f76185b337c7b41d25d5fd","nextTitle":"","nickName":"岁月","nickNameStatus":0,"occupation":"IT","registerTime":1503809880000,"roleInfo":"","roleType":0,"signature":"","signatureStatus":0,"ticketCount":2,"title":"普通会员","tmpNickName":"","tmpSignature":"","topicCount":0,"totalExp":30,"uid":1222472907,"userLevel":0,"userNextLevel":1,"username":"tXk303947856","vipInfo":"","vipType":0,"visitorCount":0,"year":1898,"month":12,"day":31,"currentYear":2021,"birthDayMonthDays":31,"job":"信息技术","subjob":"IT"}},"uid":981246875};
    
    window.openPlatform = '';
    window.openPlatformSub = '';
    window.$mtsiFlag = '0';
    window.NODE_ENV = 'production';
    
    </script> -->

    <!-- <script crossorigin="anonymous" src="//s3plus.meituan.net/v1/mss_e2821d7f0cfe4ac1bf9202ecf9590e67/cdn-prod/file:5788b470/stat.88d57c80.js"></script>
    <script>
        if(window.devicePixelRatio >= 2) {
                document.write('<link rel="stylesheet" href="//s3plus.meituan.net/v1/mss_e2821d7f0cfe4ac1bf9202ecf9590e67/cdn-prod/file:5788b470/image-2x.8ba7074d.css"/>')
             }
    </script> -->
  
    <script type="text/javascript" src="/js/host.js"></script>
    <script type="text/javascript" src="/js/vue-2.5.16.js"></script>
    <script type="text/javascript" src="/js/axios-0.18.0.min.js"></script>
    <script type="text/javascript" src="/js/jquery-1.12.4.min.js"></script>
    <script src="//cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>

    
</head>
<body>

<div id="my_div">
<div class="header">
    <div class="header-inner">
        <a href="//maoyan.com" class="logo" data-act="icon-click">猫眼电影</a>

        <div class="nav">
            <ul class="navbar">
                <li><a href="/" data-act="home-click">首页</a></li>
                <li><a href="/films" data-act="movies-click">电影</a></li>
                <li><a href="/cinemas" data-act="cinemas-click">影院</a></li>
                <li><a href="/board" data-act="board-click">榜单</a></li>
            </ul>
        </div>

        <div class="user-info">
            <div class="user-avatar has-login">
                <img :src="user_head_img" id="user_head">
                <span class="caret"></span>
                <ul class="user-menu yes-login-menu">
                    <li class="text"><a href="/profile/orders">我的订单</a></li>
                    <li class="text login-name" title="tXk303947856"><a href="javascript:void 0">基本信息</a></li>
                    <li class="text"><a href="javascript:void 0" class="J-logout" data-act="logout-click">退出登录</a></li>
                </ul>
            </div>
        </div>

        <form action="/query" target="_blank" class="search-form" data-actform="search-click">
            <input name="kw" class="search" type="search" maxlength="32" placeholder="找影视剧、影人、影院" autocomplete="off">
            <input class="submit" type="submit" value="">
        </form>


    </div>
</div>
<div class="header-placeholder"></div>


<div class="container" id="app" class="page-profile/profile">
    <div class="content">
        <div class="main">
            <div class="info-content clearfix">
                <div class="user-profile-nav">
                    <h1>个人中心</h1>
                    <a href="/profile/orders" class="orders ">我的订单</a>
                    <a href="/profile" class="profile active">基本信息</a>
                </div>

                <div class="profile-container">
                    <div class="profile-title">
                        基本信息
                    </div>
                    <div class="avatar-container">
                        <div class="avatar-content">
                            <img class="J-setted-avatar" :src="user_head_img">
                            <div class="J-upload-avatar-w upload-avatar-image">
                                <input type="button" class="J-upload-avatar upload-btn" value="更换头像">
                                <input type="file" id="fileUpload" accept="image/*" @change="getFile($event)" name="file" ref="file" value=""/>
                            </div>
                            <div class="tips">支持JPG,JPEG,PNG格式,且文件需小于1M</div>
                        </div>
                    </div>
                    <form id="J-userexinfo-form" class="userexinfo-form">
                        <div class="userexinfo-form-section">
                            <p>昵称：</p>
                            <span>
              <input type="text" name="nickName" id="userexinfo-form-nickname" class="ui-checkbox"
                     placeholder="2-15个字，支持中英文、数字" value="" v-model="username">
            </span>
                        </div>
                        <div class="userexinfo-form-section">
                            <p>性别：</p>
                            <span>
              <input type="radio" name="gender" id="userexinfo-form-gender-1" v-model="gender_radio" value="1" class="ui-radio radio-first">
              <label for="userexinfo-form-gender-1">男</label>
            </span>
                            <span>
              <input type="radio" name="gender" id="userexinfo-form-gender-2" v-model="gender_radio" value="2" class="ui-radio">
              <label for="userexinfo-form-gender-2">女</label>
            </span>
                        </div>
                        <div class="date-picker userexinfo-form-section">
                            <p>生日：</p>
                            <span>
    <div class="ui-select">
      <select name="year" v-model="year_option" class="ui-select">
        <option>--</option>
        <option value="2021">2021</option>
        <option value="2020">2020</option>
        <option value="2019">2019</option>
        <option value="2018">2018</option>
        <option value="2017">2017</option>
        <option value="2016">2016</option>
        <option value="2015">2015</option>
        <option value="2014">2014</option>
        <option value="2013">2013</option>
        <option value="2012">2012</option>
        <option value="2011">2011</option>
        <option value="2010">2010</option>
        <option value="2009">2009</option>
        <option value="2008">2008</option>
        <option value="2007">2007</option>
        <option value="2006">2006</option>
        <option value="2005">2005</option>
        <option value="2004">2004</option>
        <option value="2003">2003</option>
        <option value="2002">2002</option>
        <option value="2001">2001</option>
        <option value="2000">2000</option>
        <option value="1999">1999</option>
        <option value="1998">1998</option>
        <option value="1997">1997</option>
        <option value="1996">1996</option>
        <option value="1995">1995</option>
        <option value="1994">1994</option>
        <option value="1993">1993</option>
        <option value="1992">1992</option>
        <option value="1991">1991</option>
        <option value="1990">1990</option>
        <option value="1989">1989</option>
        <option value="1988">1988</option>
        <option value="1987">1987</option>
        <option value="1986">1986</option>
        <option value="1985">1985</option>
        <option value="1984">1984</option>
        <option value="1983">1983</option>
        <option value="1982">1982</option>
        <option value="1981">1981</option>
        <option value="1980">1980</option>
        <option value="1979">1979</option>
        <option value="1978">1978</option>
        <option value="1977">1977</option>
        <option value="1976">1976</option>
        <option value="1975">1975</option>
        <option value="1974">1974</option>
        <option value="1973">1973</option>
        <option value="1972">1972</option>
        <option value="1971">1971</option>
        <option value="1970">1970</option>
        <option value="1969">1969</option>
        <option value="1968">1968</option>
        <option value="1967">1967</option>
        <option value="1966">1966</option>
        <option value="1965">1965</option>
        <option value="1964">1964</option>
        <option value="1963">1963</option>
        <option value="1962">1962</option>
        <option value="1961">1961</option>
        <option value="1960">1960</option>
        <option value="1959">1959</option>
        <option value="1958">1958</option>
        <option value="1957">1957</option>
        <option value="1956">1956</option>
        <option value="1955">1955</option>
        <option value="1954">1954</option>
        <option value="1953">1953</option>
        <option value="1952">1952</option>
        <option value="1951">1951</option>
        <option value="1950">1950</option>
        <option value="1949">1949</option>
        <option value="1948">1948</option>
        <option value="1947">1947</option>
        <option value="1946">1946</option>
        <option value="1945">1945</option>
        <option value="1944">1944</option>
        <option value="1943">1943</option>
        <option value="1942">1942</option>
      </select>
    </div>
    <span class="tip">年</span>
  </span>
                            <span>
    <div class="ui-select">
      <select name="month" v-model="month_option" class="ui-select">
        <option>--</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
        <option value="10">10</option>
        <option value="11">11</option>
        <option value="12">12</option>
      </select>
    </div>
    <span class="tip">月</span>
  </span>
                            <span>
    <div class="ui-select">
      <select name="day" v-model="day_option" class="ui-select">
        <option>--</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
        <option value="10">10</option>
        <option value="11">11</option>
        <option value="12">12</option>
        <option value="13">13</option>
        <option value="14">14</option>
        <option value="15">15</option>
        <option value="16">16</option>
        <option value="17">17</option>
        <option value="18">18</option>
        <option value="19">19</option>
        <option value="20">20</option>
        <option value="21">21</option>
        <option value="22">22</option>
        <option value="23">23</option>
        <option value="24">24</option>
        <option value="25">25</option>
        <option value="26">26</option>
        <option value="27">27</option>
        <option value="28">28</option>
        <option value="29">29</option>
        <option value="30">30</option>
        <option value="31">31</option>
      </select>
    </div>
    <span class="tip">日</span>
  </span>
                        </div>

                        <div class="userexinfo-form-section">
                            <p>生活状态：</p>
                            <span>
              <input type="radio" name="marriage" id="userexinfo-form-merriage-1" v-model="life_status_radio" value="1"
                     class="ui-radio radio-first">
              <label for="userexinfo-form-merriage-1">单身</label>
            </span>
                            <span>
              <input type="radio" name="marriage" id="userexinfo-form-merriage-2" v-model="life_status_radio" value="2" class="ui-radio">
              <label for="userexinfo-form-merriage-2">热恋中</label>
            </span>
                            <span>
              <input type="radio" name="marriage" id="userexinfo-form-merriage-3" v-model="life_status_radio" value="3" class="ui-radio">
              <label for="userexinfo-form-merriage-3">已婚</label>
            </span>
                            <span>
              <input type="radio" name="marriage" id="userexinfo-form-merriage-4" v-model="life_status_radio" value="4" class="ui-radio">
              <label for="userexinfo-form-merriage-4">为人父母</label>
            </span>
                        </div>
                        <div class="userexinfo-form-section">
                            <p>从事行业：</p>
                            <span>
              <div class="ui-select">
                <select id="job" name="job" v-model="job_option" class="ui-select">
                  <option value="信息技术">信息技术</option>
                  <option value="金融保险">金融保险</option>
                  <option value="商业服务">商业服务</option>
                  <option value="建筑地产">建筑地产</option>
                  <option value="工程制造">工程制造</option>
                  <option value="交通运输">交通运输</option>
                  <option value="文化传媒">文化传媒</option>
                  <option value="娱乐体育">娱乐体育</option>
                  <option value="公共事业">公共事业</option>
                  <option value="学生">学生</option>
                  <option value="其他">其他</option>
                </select>
              </div>
              <div class="ui-select">
                <select id="subjob" name="occupation" v-model="occupation_option" class="ui-select">
                    <option :value="occu" v-for="occu in occupation1[job_option]">[[ occu ]]</option>
                </select>
              </div>
            </span>
                        </div>

                        <div class="userexinfo-form-section expand-list">
                            <p>兴趣：</p>
                            <div class="interest-list">
              <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-1" value="美食" class="ui-checkbox">
                <label for="userexinfo-form-interest-1">美食</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-2" value="动漫" class="ui-checkbox">
                <label for="userexinfo-form-interest-2">动漫</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-3" value="摄影" class="ui-checkbox">
                <label for="userexinfo-form-interest-3">摄影</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-4" value="电影" class="ui-checkbox">
                <label for="userexinfo-form-interest-4">电影</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-5" value="体育" class="ui-checkbox">
                <label for="userexinfo-form-interest-5">体育</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-6" value="财经" class="ui-checkbox">
                <label for="userexinfo-form-interest-6">财经</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-7" value="音乐" class="ui-checkbox">
                <label for="userexinfo-form-interest-7">音乐</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-8" value="游戏" class="ui-checkbox">
                <label for="userexinfo-form-interest-8">游戏</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-9" value="科技" class="ui-checkbox">
                <label for="userexinfo-form-interest-9">科技</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-10" value="旅游"
                       class="ui-checkbox">
                <label for="userexinfo-form-interest-10">旅游</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-11" value="文学"
                       class="ui-checkbox">
                <label for="userexinfo-form-interest-11">文学</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-12" value="公益"
                       class="ui-checkbox">
                <label for="userexinfo-form-interest-12">公益</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-13" value="汽车"
                       class="ui-checkbox">
                <label for="userexinfo-form-interest-13">汽车</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-14" value="时尚"
                       class="ui-checkbox">
                <label for="userexinfo-form-interest-14">时尚</label>
              </span>
                                <span>
                <input type="checkbox" name="interest[]" id="userexinfo-form-interest-15" value="宠物"
                       class="ui-checkbox">
                <label for="userexinfo-form-interest-15">宠物</label>
              </span>
                                <span class="bottom-tips">选择你的兴趣使你获得个性化的电影推荐哦</span>
                            </div>
                        </div>
                        <div class="userexinfo-form-section">
                            <p>个性签名：</p>
                            <span>
              <input type="text" name="signature" id="userexinfo-form-bio" class="ui-checkbox" placeholder="20个字以内"
                     value="" v-model="signature">
            </span>
                        </div>
                        <input id="csrf" type="hidden" name="csrf"
                               value="bae1d2745a80b42e340bce8cbc5d3684f6f909982c6e4286b3ac42d00090076e">
                        <div class="userexinfo-bottom-section clearfix">
                            <input type="button" @click="submit_user_info" class="form-save-btn" value="保存">
                            <!-- <span id="cancell-btn" class="cancel_alert hand">注销账号1</span> -->
                        </div>

                    </form>
                </div>

            </div>
        </div>

        <div class="body-mask"></div>
        <div id="img-cropper" class="img-cropper">
            <div class="img-cropper-container">
                <div class="img-cropper-header">
                    上传头像
                    <span class="close-icon"></span>
                </div>
                <div class="img-cropper-content">
                    <div class="img-main">
                        <div class="img-main-wrapper">
                            <img src="" id="preview">
                        </div>
                    </div>

                </div>
                <div class="img-cropper-footer">
                    <div class="img-btn-confirm" @click="yes_img">
                        确认
                    </div>
                    <div class="img-btn-cancel">
                        取消
                    </div>
                </div>
            </div>
        </div>
        <script>
            var occupation = {
                "信息技术": ["互联网", "IT", "通信", "电子", "游戏"],
                "金融保险": ["投资", "股票基金", "保险", "银行", "信托担保"],
                "商业服务": ["资讯", "贸易", "美容保健", "家政服务", "旅游", "餐饮酒店", "娱乐休闲", "批发零售", "汽车"],
                "建筑地产": ["房地产", "建筑", "物业", "装修"],
                "工程制造": ["机械制造", "生物医药", "食品", "服装", "能源", "化工"],
                "交通运输": ["航空", "铁路", "航运船舶", "公共交通", "物流运输"],
                "文化传媒": ["媒体出版", "设计", "广告创意", "动漫", "公关会展", "摄影"],
                "娱乐体育": ["影视", "运动体育", "音乐", "模特"],
                "公共事业": ["医疗", "教育", "政府机关", "科研", "公益机构", "农林牧渔"],
                "学生": ["学生"],
                "其他": ["其他"]
            };
        </script>

    </div>

    <div class="mask3">
        <div class="modal-container" style="display:none">
            <div class="modal">
                <span class="icon"></span>

                <p class="tip">您确定要删除该订单嘛？删除后，不可恢复～</p>

                <div class="short btn ok-btn">确定</div>
                <div class="short btn cancel-btn">取消</div>
            </div>
        </div>

    </div>

    <div class='mask1'>
        <div class="modal-container" style="display:none">
            <div class="modal">
                <span class="icon"></span>

                <p class="tip">请注意，注销账号会清空所有订单信息、影评、积分、<br>账户余额等信息且无法找回，是否继续？</p>

                <div class="short btn ok-btn">确定</div>
                <div class="short btn cancel-btn">取消</div>
            </div>
        </div>

    </div>

    <div class='mask2'>
        <div class="modal-container" style="display:none">
            <div class="modal">
                <span class="icon"></span>

                <p class="tip">请联系客服10105335</p>

                <div class="ok-btn btn">我知道了</div>
            </div>
        </div>

    </div>

</div>


<!--[if IE 8]>
<script crossorigin="anonymous"
        src="//s3plus.meituan.net/v1/mss_e2821d7f0cfe4ac1bf9202ecf9590e67/cdn-prod/file:5788b470/es5-shim.bbad933f.js"></script>
<![endif]-->
<!--[if IE 8]>
<script crossorigin="anonymous"
        src="//s3plus.meituan.net/v1/mss_e2821d7f0cfe4ac1bf9202ecf9590e67/cdn-prod/file:5788b470/es5-sham.d6ea26f4.js"></script>
<![endif]-->
<script type="text/javascript" src="/js/common.js"></script>
<script type="text/javascript" src="/js/user_info.js"></script>

</div>

</body>
</html>
